import { HeadingTypes } from "@/data/componentData/sharedComponentTypes";
import { ViewProps } from "@tarojs/components";
import { PropsWithChildren } from "react";
import WrappingText from "../WrappingText";
import style from "./index.module.scss";

interface HeaderProps extends ViewProps {
  type: HeadingTypes;
  color?: string;
  noSpacing?: boolean;
}

const Header = ({
  className,
  children,
  type,
  color,
  noSpacing = false,
  ...props
}: PropsWithChildren<HeaderProps>) => {
  return (
    <WrappingText
      className={`
        ${className ?? ""} 
        ${type} 
        ${style["header"]} 
        ${noSpacing ? style["no-spacing"] : ""}`}
      {...props}
      color={color}
    >
      {children}
    </WrappingText>
  );
};

export default Header;
